<template>
    <div class="my-account-box">
        <div>
            <el-tabs tab-position="left" class="my-account-tab">
                <el-tab-pane label="现金账户"><AccountDetail /></el-tab-pane>
                <el-tab-pane label="金融账户">Config</el-tab-pane>
                <el-tab-pane label="虚拟账户">Role</el-tab-pane>
            </el-tabs>
        </div>

    </div>
</template>

<script lang="ts" setup>
import { AccountDetail } from '@/components/Money';
import * as MoneyApi from '@/api/money'

const a = async () => {
    console.log(await MoneyApi.getAccountInfo())
}

a();

</script>

<style lang="scss" scoped>
.my-account-box {
    border: solid 1px #dcdfe6;
    border-radius: 4px;
    
    & .el-tabs {
        display: flex;
    }
}

:deep(.my-account-tab .el-tabs__active-bar) {
        display: none;
}

:deep(.my-account-tab .el-tabs__nav-wrap.is-left:after) {
        display: none;
}

:deep(.my-account-tab .el-tabs__content)  {
    border-left: solid 1px #dcdfe6;
    padding: 20px;   
    padding-top: 0; 
    width: 100%;
}
</style>